<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<script type="text/javascript">
	window.onload=function(){
		// //获得标签
		// box = document.getElementsByClassName('box');
		// box1 = document.getElementsByClassName('box1');
		p = document.getElementsByClassName('p');
		// // a1=document.getElementById('aa');
		// // p1 = p.cloneNode(true);
		// bt.onclick=function(){}//点击事件
		// 	//追加节点
	 //   		var btn=document.createElement("p");
	 //   		btn.innerHTML='hhahhh';//放入文本
	 //    	box[0].appendChild(btn);//类的标签后面加上下标
	 //    	a1=document.createElement('a');
	 //    	 text = document.createTextNode('噢噢噢噢');//加入文本节点就是字
	 //    	p[0].appendChild(text);//追加文本到p标签的子节点中
	 //    	text=document.createTextNode('hhhhhaaaaaaaaaaaaaa');
	 //    	a1= document.createElement('a');
	 //    	a1.appendChild(text);//加子节点
	 //    	box1[0].appendChild(a1);
	 //    	a.innerHTML='hhhh啦啦';//在标签里面他的属性值
	 //    	??
	 //    	a=box1[0].appendChild(a1);
	 //    		t = document.createElement('a');
	 //    		t.href="http://www.sss.com";
	 //    		t.innerHTML='阿打发打发';
	 //    		box[0].insertBefore(t, p[0]);
	 //    		p[0].removeChild(a);
	 //           box[0].replaceChild(t, a1);
	 //           pp=p[0].cloneNode();//克隆它的标签,加true把他的字元素包括进去了
	 //           box[0].appendChild(pp);
	 //            a1 = document.createElement('a');
	 //            a1.href="http://www.baidu.com";//可以加它固有属性的值
	 //            a1.innerHTML="百度";
	 //            box[0].appendChild(a1);
	            //---------------------------
	            p[0].parentNode.firstChild.style.backgroundColor="blue";
	            // box[0].firstChild.style.backgroundColor="blue";
	}

	</script>
	<style type="text/css">
	.box{
		width: 300px;
		height: 300px;
		background: red url() 0 0 no-repeat;
	}
	.box1{
		width: 200px;
		height: 200px;
		background: blue url() 0 0 no-repeat;
	}


	</style>
	<title>DOM节点</title>
</head>
<body>
   <input type="button" id="bt" value="点击">
	<div class="box">
		<a href="" id="aa"></a>
		<p class="p">啦啦啦啦啦</p>
	</div>
	<div class="box1"></div>
</body>
</html>